// 首页
.index-page {
    .index-page-container {
        overflow-y: auto;
        height: 100%;
    }
    .index-page-cont {
        overflow-y: auto;
    }
}
// 审批
.approval-page {

    .ui-mobile-scroll,
    .centre-page {
        height: 100%;
    }
    .blank-grey {
        height: px2rem(32px);
        background-color: #F8F8F8;
    }
    .title {
        padding: 0 px2rem(30px);
        height: px2rem(92px);
        line-height: px2rem(92px);
        font-size: px2rem(34px);
        font-weight: bold;
        color: #333333;
    }
    .centre-cont {
        margin: 0 px2rem(24px);
    }
    .centre-items {
        /*height: px2rem(276px);*/
        padding: px2rem(30px) px2rem(30px) px2rem(16px);
        font-size: 0;

        .centre-item {
            display: inline-block;
            vertical-align: middle;
            text-align: center;

            .item-container {
                position: relative;
                width: px2rem(100px);

                .new-num {
                    position: absolute;
                    height: px2rem(36px);
                    line-height: px2rem(36px);
                    font-size: px2rem(24px);
                    padding: 0 px2rem(12px);
                    color: #FFFFFF;
                    background: #f95e5a;
                    right: -px2rem(12px);
                    top: -px2rem(12px);
                    border-radius: px2rem(12px);
                }
                .centre-icon {
                    width: px2rem(100px);
                    height: px2rem(100px);
                    margin: 0 auto;
                }
                .centre-text {
                    font-size: px2rem(24px);
                    color: #333333;
                    height: px2rem(55px);
                    line-height: px2rem(55px);
                    margin-top: 0;
                    white-space: nowrap;
                }
            }
        }

        .centre-item.my-launch .centre-icon {
            background: url('images/svg/approval/my-launch.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.my-handle .centre-icon {
            background: url('images/svg/approval/my-handle.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.has-handle .centre-icon {
            background: url('images/svg/approval/has-handle.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.copy-send .centre-icon {
            background: url('images/svg/approval/copy-send.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.my-approval .centre-icon {
            background: url('images/svg/approval/my-approval.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.my-initiate .centre-icon {
            background: url('images/svg/approval/my-initiate.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.prev-field .centre-icon {
            background: url('images/svg/approval/prev-field.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.book-field .centre-icon {
            background: url('images/svg/approval/book-field.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.perform .centre-icon {
            background: url('images/svg/approval/perform.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.brand-project .centre-icon {
            background: url('images/svg/approval/brand-project.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        
        .centre-item.reimbursement .centre-icon {
            background: url('images/svg/approval/reimbursement.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.corporatePayment .centre-icon {
            background: url('images/svg/approval/corporatePayment.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.loan .centre-icon {
            background: url('images/svg/approval/loan.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.purchase .centre-icon {
            background: url('images/svg/approval/purchase.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.cost .centre-icon {
            background: url('images/svg/approval/cost.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        
        .centre-item.agreement-xb .centre-icon {
            background: url('images/svg/approval/agreement_xb.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.agreement-bc .centre-icon {
            background: url('images/svg/approval/agreement_bc.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.agreement-sw .centre-icon {
            background: url('images/svg/approval/agreement_sw.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.agreement-zb .centre-icon {
            background: url('images/svg/approval/agreement_zb.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.sponsor .centre-icon {
            background: url('images/svg/approval/sponsor.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        .centre-item.musician .centre-icon {
            background: url('images/svg/approval/musician.svg') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
    }
    .centre-items.approval,
    .centre-items.finance {

        .centre-item {
            width: auto;

            .item-container {
                margin: auto;

                .centre-icon {
                    /*width: px2rem(60px);
                    height: px2rem(66px);*/
                    /*margin: 0 auto;*/
                }
                .centre-text {
                    /*margin-top: 0;*/
                }
            }
        }
    }
    .centre-items.order {
        .centre-item {
            width: 28%;
        }
    }
    .centre-items.agreement,
    .centre-items.other {
        .centre-item {
            width: 25%;
        }
    }
}
// 首页 - 我的
.me-page {
    position: relative;
    height: 100%;

    .ui-mobile-scroll-body {

    }
    .info-item {
        position: relative;
        display: -webkit-flex;
        display: flex;
        align-items: center;
        height: px2rem(90px);
        padding: 0 px2rem(52px);
    
        &.staff-info-item {
            display: block;
            padding: px2rem(26px);
            height: auto;
            border-width: 0;
    
            .staff-info {
                position: relative;
                height: px2rem(267px);
                background: rgb(255, 255, 255);
                border: px2rem(1px) solid rgba(236, 236, 236, 1);
                box-shadow: 0px px2rem(5px) px2rem(8px) 0px rgba(14, 13, 13, 0.21);
                border-radius: px2rem(29px);
                color: #333333;
    
                .name {
                    margin: px2rem(39px) 0 0 px2rem(28px);
                    font-size: px2rem(36px);
                }
                .venue {
                    position: absolute;
                    bottom: px2rem(35px);
                    left: px2rem(28px);
                    right: px2rem(140px);
                    font-size: px2rem(30px);
                    color: #666666;
                    max-height: px2rem(88px);
                    overflow: hidden;
                }
                .head {
                    position: absolute;
                    top: px2rem(46px);
                    right: px2rem(28px);
                    display: inline-block;
                    vertical-align: middle;
                    width: px2rem(80px);
                    font-size: px2rem(30px);
                    text-align: center;
                    // background-color: #E84F4B;
                    color: #fff;
                    height: px2rem(80px);
                    line-height: px2rem(80px);
                    border-radius: px2rem(80px);
                    overflow: hidden;
                    border-width: 0;
    
                    img {
                        width: 100%;
                        height: 100%;
                    }
                    input {
                        position: absolute;
                        top: 0;
                        left: 0;
                        width: 100%;
                        height: 100%;
                        opacity: 0;
                    }
                }
                .position {
                    position: absolute;
                    width: px2rem(80px);
                    top: px2rem(137px);
                    right: px2rem(28px);
                    font-size: px2rem(24px);
                    text-align: center;
                }
            }
        }
        .label {
            font-size: px2rem(30px);
            color: #333333;
        }
        .info {
            -webkit-flex: 1;
            flex: 1;
            text-align: right;
            margin-right: px2rem(15px);
            font-size: px2rem(18px);
            color: #999999;
        }
        .link-icon {
            height: px2rem(22px);
            width: px2rem(12px);
            background: url('images/base/arrow-r-gray.png') no-repeat no-repeat center center;
            background-size: 100% 100%;
        }
        &:after {
            content: ' ';
            position: absolute;
            left: px2rem(52px);
            right: px2rem(52px);
            bottom: 0;
            height: px2rem(1px);
            background-color: #E4E4E4;
        }
        &.staff-info-item:after {
            display: none;
        }
        &.feedback:after {
            display: none;
        }
    }
    .logout {
        position: absolute;
        left: 0;
        bottom: 0;
        right: 0;
        border-top: px2rem(1px) solid #EEEEEE;
        text-align: center;
    
        .text {
            -webkit-flex: 1;
            flex: 1;
        }
    }
}
// 首页 - 费用
.bill-page {
    .ui-cost-invoice-add {
        position: fixed;
        bottom: px2rem(160px);
        right: px2rem(60px);
        width: px2rem(100px);
        height: px2rem(100px);
        font-size: 0;
        z-index: 2;
        background: url('images/order/add.png') no-repeat center;
        background-size: 100% auto;
    }
}